<template>
	<view class="logins">
		<view class="pure_top">
			<view class="U_view">
				<view class="U_item">
					<view class="U_head">
					    <!-- #ifdef APP-PLUS -->	
						<image v-if="user.wx_avatar_url" :src="user.wx_avatar_url"></image>
						<image v-else src="https://manager.ryz1620.com/static/my/avator.png"></image>
						<!-- #endif -->
						<!-- #ifdef MP-WEIXIN -->
						<open-data class="user-avatar" type="userAvatarUrl"></open-data>
						<!-- #endif -->
					</view>
					<view class="U_message">
						<view class="U_phone">{{ token ? user.nickname : '未登陆' }}</view>
						<view style="display: flex;align-items: center;justify-content: space-between;flex: 1;width: 100%;">
							<view class="U_King" v-if="user.promoter_level != 0 && token != null">
								<view class="U_King_icon"><image src="https://cos.ryz1620.com/liankun/static/user/king.png"></image></view>
								<!-- 0-非创客，1-铜牌精英，2-银牌，3-金牌，9-创业主 -->
								<view class="U_King_text" v-if="user.promoter_level != 0">
									<text v-if="user.promoter_level == 9">创业主</text>
									<text v-if="user.promoter_level == 3">金牌精英</text>
									<text v-if="user.promoter_level == 2">银牌精英</text>
									<text v-if="user.promoter_level == 1">铜牌精英</text>
									<!-- <text v-if="user.promoter_level == 0">非创客</text> -->
								</view>
							</view>
							<view v-else style="flex: 1;" @click="headClickEvent">
								<text v-if="token == null" style="font-size: 28rpx;color: #333;">您好,欢迎</text>
								<text v-else>快去修改资料信息吧~</text>
							</view>
							<view class="iconfont icon-more" @click="headClickEvent" style="color: #939393;"></view>
						</view>
					</view>
				</view>
			</view>
			<view class="U_list">
				<view class="U_list_View">
					<view class="U_list_item" @click="openurl('/pages_mine/pages/my/attention')">
						<view class="U_list_num">{{ UserData.follow_num ? UserData.follow_num : 0 }}</view>
						<view class="U_list_title">关注</view>
					</view>
					<view class="U_list_item" @click="openurl('/pages_mine/pages/my/collect')">
						<view class="U_list_num">{{ UserData.collect_num ? UserData.collect_num : 0 }}</view>
						<view class="U_list_title">收藏</view>
					</view>
					<view class="U_list_item" @click="openurl('/pages_mine/pages/my/track')">
						<view class="U_list_num">{{ UserData.trace_num ? UserData.trace_num : 0 }}</view>
						<view class="U_list_title">足迹</view>
					</view>
					<view class="U_list_item" @click="openurl('/pages_mine/pages/my/message/index')">
						<view class="U_list_num">{{ UserData.information_num ? UserData.information_num : 0 }}</view>
						<view class="U_list_title">消息</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 我的订单 -->
		<view class="Order">
			<view class="MyOrder">
				<view class="O_title">我的订单</view>
				<view class="O_View">
					<view class="O_item" @click="openurl('/pages_mall/pages/mall/order/list')">
						<view class="O_Redtips" v-if="userorder.product_order_num">{{ userorder.product_order_num}}</view>
						<view class="O_image"><image src="https://manager.ryz1620.com/static/my/a1.png"></image></view>
						<view class="O_Text">商城</view>
					</view>
					<view class="O_item" @click="openurl('/pages_product/pages/product/order/list')">
						<view class="O_Redtips" v-if="userorder.pack_order_num">{{ userorder.pack_order_num}}</view>
						<view class="O_image"><image src="https://manager.ryz1620.com/static/my/a2.png"></image></view>
						<view class="O_Text">产品包</view>
					</view>
					<view
						class="O_item"
						@click="openurl('/pages_design/pages/design/order/list')"
						style="position: relative;width: 25%;display: flex;align-items: center;flex-direction: column;justify-content: center;"
					>
						<view class="O_Redtips" v-if="userorder.designer_order_num">{{ userorder.designer_order_num}}</view>
						<view class="O_image"><image src="https://manager.ryz1620.com/static/my/a3.png"></image></view>
						<view class="O_Text">设计单</view>
					</view>
					<view class="O_item" @click="openurl('/pages_two/pages/order/index')">
						<view class="O_Redtips" v-if="userorder.builder_order_num">{{ userorder.builder_order_num}}</view>
						<view class="O_image"><image src="https://manager.ryz1620.com/static/my/a4.png"></image></view>
						<view class="O_Text">装修施工单</view>
					</view>
				</view>
			</view>
		</view>
		<!-- view图层 -->
		<view class="ViewTips"></view>
		<!-- cell列表 -->

		<view class="CellList">
			<view class="O_title">其他工具</view>
			<view class="CellView">
				<view class="C_item" @click="openurl('/pages_mall/pages/mall/cart/cart')">
					<view class="C_left">
						<view class="C_left_image"><image src="https://manager.ryz1620.com/static/my/w1.png"></image></view>
						<view class="C_left_des">购物车</view>
					</view>
				</view>
				<view class="C_item" @click="gitmarkshow()">
					<!-- @click="openurl('/pages_mine/pages/my/discountlist')" -->
					<view class="C_left">
						<view class="C_left_image"><image src="https://manager.ryz1620.com/static/my/w2.png"></image></view>
						<view class="C_left_des">切换卖场</view>
					</view>
				</view>
				<view class="C_item" @click="openurl('/pages_now/pages/coupon/list?current=' + 1)">
					<!-- @click="openurl('/pages_mine/pages/my/discountlist')" -->
					<view class="C_left">
						<view class="C_left_image"><image src="https://manager.ryz1620.com/static/my/w3.png"></image></view>
						<view class="C_left_des">优惠券</view>
					</view>
				</view>
				<!-- #ifndef MP-WEIXIN -->
				<view class="C_item" @click="openurl('/pages_customer/pages/index?partner_type=root&partner_id=0')">
					<view class="C_left">
						<view class="C_left_image"><image src="https://manager.ryz1620.com/static/my/w4.png"></image></view>
						<view class="C_left_des">客服</view>
					</view>
				</view>
				<!-- #endif -->
				<!-- #ifdef MP-WEIXIN -->
				<view class="C_item" @click="openurl('/pages_customer/pages/index?partner_type=root&partner_id=0')" v-if="!config_id && !config_url">
					<view class="C_left">
						<view class="C_left_image"><image src="https://manager.ryz1620.com/static/my/w4.png"></image></view>
						<view class="C_left_des">客服</view>
					</view>
				</view>
				<view class="C_item" v-else @click="gitpouchatshow">
					<view class="C_left">
						<view class="C_left_image"><image src="https://manager.ryz1620.com/static/my/w4.png"></image></view>
						<view class="C_left_des">客服</view>
					</view>
				</view>
				<!-- #endif -->
				</view>
				<view class="CellView">
				<!-- 礼包 -->
				<view class="C_item" @click="goActivity('/pages_activity/pages/giftBag/giftBag/index')">
					<view class="C_left">
						<view class="C_left_image"><image src="https://manager.ryz1620.com/static/my/w5.png"></image></view>
						<view class="C_left_des">礼品包</view>
					</view>
				</view>
				<view class="C_item" @click="openurladdres">
					<view class="C_left">
						<view class="C_left_image"><image src="https://manager.ryz1620.com/static/my/w6.png"></image></view>
						<view class="C_left_des">地址管理</view>
					</view>
				</view>
				<view class="C_item" @click="goActivity('/pages_activity/pages/payment/orderBill')">
					<view class="C_left">
						<view class="C_left_image"><image src="https://manager.ryz1620.com/static/my/w7.png"></image></view>
						<view class="C_left_des">付款记录</view>
					</view>
				</view>
				<view class="C_item" @click="headClickEvent">
					<view class="C_left">
						<view class="C_left_image"><image src="https://manager.ryz1620.com/static/my/w8.png"></image></view>
						<view class="C_left_des">设置</view>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 微信客服 -->
		<view class="pouchat" v-if="pouchatshow">
		  <view class="poucont">	
			<view class="chatlist">
				<view class="chatml" @click="gitwxchat()" v-if="config_url">
					<image src="https://manager.ryz1620.com/static/my/wxchat.png" mode="widthFix"></image>
					<text class="t1">在线微信客服</text>
					<text class="t2">可直接联系客服</text>
				</view>
				<view class="chatml" v-if="config_id">
					<cell class="cell-service" bind:startmessage='startmessage' bind:completemessage="completemessage" :plugid="config_id"/>
					<image src="https://manager.ryz1620.com/static/my/codechat.png" mode="widthFix"></image>
					<text class="t1">添加微信客服</text>
					<text class="t2">扫微信二维码</text>
				</view>
			</view>
			<view class="iconfont icon-close" @click="wxCodeClick"></view>
		  </view>	
		</view>	
		
		<!-- 选择卖场 -->
		<view class="maipou" v-if="Marketidshow">
		  <view class="maicont">	
			<view class="maitop">请选择卖场 <text class="iconfont icon-close" @click="gitmarkshow()"></text></view>
			<view class="contnam">
				<view class="itemmai" @click="gitMarketid(item)" :class="{active:Marketid==item.id}" v-for="(item,index) in Marketlist" :key="index">
					<image :src="`https://manager.ryz1620.com/static/my/dl${index+1}.png`"></image>
					<text>{{item.name}}</text>
				</view>
			</view>
			<view class="maibtn" @click="gitMarketchose()">进入卖场</view>
		  </view>	
		</view>
	</view>
</template>

<script>
// import navBar from "@/components/navBar/navBar.vue"
import service_my from '@/service/my.js';
import service_mall from '@/service/mall.js'
import URL from '@/config/url.js';

export default {
	components: {
		// #ifdef MP-WEIXIN
			"cell": "plugin://contactPlugin/cell",
		// #endif
	},
	data() {
		return {
			token: '',
			userMobile: '',
			user: '',
			userorder: '',
			UserData: '',
			config_id:'',
			config_url:'',
			pouchatshow:false,
			Marketlist:[],
			Marketid:'',
			Marketname:'',
			Marketnames:'',
			Marketidshow:false,
		};
	},
	onLoad() {
		this.Marketnames = uni.getStorageSync('Marketname') || ''
		this.Marketid = uni.getStorageSync('Marketid') || ''
		this.gitMarket()
		this.$utils.getUrl()
		// #ifdef MP-WEIXIN
		let token = uni.getStorageSync('token')
		if(token){
			 this.$utils.gitsetting()
		}
		// #endif
		this.gitConfig()
		this.gitwxConfig()
	},
	onShow() {
		this.gitusers();
		this.userMobile = this.$store.state.index.userMobile;
		this.token = uni.getStorageSync('token');
		// console.log(uni.getStorageSync('token'));
		// gio('setPage', {
		// 	pageName: '个人中心'
		// });
	},
	methods: {
		// 获取卖场信息
		gitMarket() {
			service_mall.Market({}).then(res => {
					if (res.code == 1) {
						this.Marketlist = res.data
					}
			});
		},
		gitmarkshow(){
			this.Marketidshow = !this.Marketidshow
		},
		gitMarketid(item){
			this.Marketid = item.id
			this.Marketname = item.name
		},
		gitMarketchose(){
			uni.setStorageSync('Marketid', this.Marketid);
			uni.setStorageSync('Marketname', this.Marketname);
			this.Marketidshow = true
			uni.reLaunch({
				url:"/pages/my/index"
			})
		},
		// 获取企业微信callme配置
		gitConfig() {
			service_mall.getCallMeConfig({ partner_type: 'root', partner_id: 1 }).then(res => {
				if (res.code == 1) {
					this.config_id = res.data.config_id;
				}
			});
		},
		gitwxConfig() {
			service_mall.getwxMeConfig({ partner_type: 'root', partner_id: 1 }).then(res => {
				if (res.code == 1) {
					this.config_url = res.data.url;
				}
			});
		},
		gitpouchatshow(){
			this.pouchatshow = true
		},
		wxCodeClick(){
			this.pouchatshow = false
		},
		gitwxchat(){
			wx.openCustomerServiceChat({
			  extInfo: {url: this.config_url},
			  corpId: this.$env.CORPID,
			  success(res) {}
			})
		},
		gitusers() {
			service_my
				.getuser({})
				.then(res => {
					if (res.code == 1) {
						this.user = res.data.userinfo;
						console.log(this.user)
						this.getcount();
						this.getUserCount();
					}
				})
				.catch(err => {});
		},
		getUserCount() {
			service_my
				.getUserCount({})
				.then(res => {
					if (res.code == 1) {
						this.UserData = res.data;
						// this.userorder = res.data
					}
				})
				.catch(err => {});
		},
		getcount() {
			service_my
				.getcount({})
				.then(res => {
					if (res.code == 1) {
						this.userorder = res.data;
					}
				})
				.catch(err => {});
		},
		getnone(url) {
			// uni.showToast({
			// 	title: '功能正在开发中...',
			// 	icon:'none',
			// 	duration: 2000
			// });
			uni.navigateTo({
				url: url
			});
		},
		headClickEvent() {
			if (!this.token) {
				uni.navigateTo({
					url: '/pages_login/pages/login/login/index'
				});
			} else {
				uni.navigateTo({
					url: '/pages_mine/pages/my/setting'
				});
			}
		},
		goActivity(url){
			uni.navigateTo({
				url: url
			});
		},
		openadmin() {
			uni.navigateToMiniProgram({
				appId: 'wxe7f34fe6cd1469bf',
				path: 'pages/mall/newIndex/newIndex',
				extraData: {},
				envVersion: 'develop',
				success(res) {
					// 打开成功
				}
			});
		},
		openurl(url) {
			if (!this.token) {
				uni.navigateTo({
					url: '/pages_login/pages/login/login/index'
				});
			} else {
				uni.navigateTo({
					url
				});
			}
		},
		GoDiscount() {
			console.log(123);
			uni.navigateTo({
				url: '/pages_mine/pages/my/discountlist'
			});
		},
		openurladdres() {
			if (!this.token) {
				uni.navigateTo({
					url: '/pages_login/pages/login/login/index'
				});
			} else {
				uni.navigateTo({
					url: '/pages_mine/pages/my/address/list'
				});
			}
		}
	}
};
</script>

<style lang="scss">
page {
	background: #f8f8f8 !important;
}

.pure_top {
	width: 100%;
	height: 592rpx;
	position: relative;
	z-index: 1;
	overflow: hidden;
	margin-bottom: 20rpx;
	background-image: url(https://cos.ryz1620.com/liankun/static/user/my_bg.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;

	.U_view {
		margin-top: 170rpx;
		padding: 0 32rpx;
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
		z-index: 9999;

		.U_item {
			display: flex;
			align-items: center;
			flex: 1;
			width: 100%;

			.U_head {
				width: 112rpx;
				height: 112rpx;
				border-radius: 100%;
				overflow: hidden;
				margin-right: 52rpx;
			}

			.U_message {
				flex: 1;
				width: 100%;

				.U_phone {
					font-size: 40rpx;
					font-weight: 600;
					line-height: 40rpx;
					color: #333333;
					margin-bottom: 10rpx;
					flex: 1;
					width: 100%;
				}

				.U_King {
					display: flex;
					align-items: center;
					background: #fdf0c9;
					border-radius: 20rpx;
					width: max-content;
					padding: 6rpx 20rpx 6rpx 6rpx;

					.U_King_icon {
						width: 28rpx;
						height: 28rpx;
						margin-right: 6rpx;
					}

					.U_King_text {
						font-size: 20rpx;
						font-weight: 500;
						color: #333333;
					}
				}
			}
		}
	}

	.U_list {
		.U_list_View {
			margin-top: 32rpx;
			display: flex;
			align-items: center;
			justify-content: space-around;

			.U_list_item {
				width: 25%;

				.U_list_num {
					font-size: 28rpx;
					font-weight: 600;
					line-height: 40rpx;
					color: #333333;
					margin-top: 2rpx;
					text-align: center;
				}

				.U_list_title {
					font-size: 24rpx;
					font-weight: 400;
					line-height: 44rpx;
					color: #333333;
					text-align: center;
				}
			}
		}
	}
}

.Order {
	width: 100%;
	flex: 1;
	box-sizing: border-box;
	position: absolute;
	top: 430rpx;
	z-index: 99 !important;
}

.MyOrder {
	margin: 0rpx 32rpx 0 32rpx;
	padding: 28rpx 0rpx;
	background: #fff;
	border-radius: 8rpx;

	.O_title {
		margin-left: 44rpx;
		margin-bottom: 32rpx;
		font-size: 32rpx;
		font-weight: 600;
		line-height: 52rpx;
		color: #333333;
	}

	.O_View {
		display: flex;
		align-items: center;
		justify-content: space-between;

		.O_item {
			position: relative;
			width: 25%;
			display: flex;
			align-items: center;
			flex-direction: column;
			justify-content: center;

			.O_Redtips {
				display: block;
				width: 36rpx;
				height: 36rpx;
				border-radius: 50%;
				text-align: center;
				line-height: 36rpx;
				background: #fa3534;
				color: #fff;
				position: absolute;
				right: 30rpx;
				top: -14rpx;
				font-size: 20rpx;
				z-index: 9;
			}

			.O_image {
				width: 78rpx;
				height: 78rpx;
				margin-bottom: 10rpx;
			}

			.O_Text {
				font-size: 26rpx;
				font-weight: 400;
				line-height: 44rpx;
				color: #333333;
			}
		}
	}
}

.ViewTips {
	height: 116rpx;
	margin: 154rpx 32rpx 24rpx 32rpx;
	background-image: url(https://cos.ryz1620.com/liankun/static/user/tips.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.CellList {
	margin: 0 32rpx;
	margin-bottom: constant(safe-area-inset-bottom);
	/*兼容 IOS<11.2*/
	margin-bottom: env(safe-area-inset-bottom);
	/*兼容 IOS>11.2*/
	margin-bottom: 100rpx;
    background: #fff;
	padding: 24rpx 0;
	border-radius: 15rpx;
	.O_title {
	    margin-left: 44rpx;
	    font-size: 32rpx;
	    font-weight: 600;
	    line-height: 72rpx;
	    color: #333333;
	}
	.CellView {
        display: flex;
		.C_item {
			padding: 14rpx 0;
			flex: 1;
			text-align: center;
			justify-content: center;
            position: relative;
			font-size: 28rpx;
			.C_left {
				align-items: center;
				.C_left_image {
					width: 68rpx;
					height: 68rpx;
					display: block;
					margin: 10rpx auto;
				}

				.C_left_des {
					font-size: 26rpx;
					font-weight: 400;
					line-height: 40rpx;
					color: #333333;
				}
			}
		}
	}
}
	// 客服弹框
	.pouchat{
		position: fixed;
		background: rgba(0,0,0,0.5);
		top:0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 9999;
		.poucont{
			position: absolute;
			top:30%;
			left: 15%;
			right: 15%;
			.icon-close{
				width: 80rpx;
				height: 80rpx;
				font-size: 70rpx;
				color: #fff;
				line-height: 80rpx;
				text-align: center;
				margin: 30rpx auto;
			}
		}
		.chatlist{
			background: #fff;
			padding:30rpx;
			border-radius: 10rpx;
		}
		.chatml{
			position: relative;
			padding: 20rpx;
			padding-left: 100rpx;
			min-height: 100rpx;
			.cell-service{
				position: absolute;
				right: 0;
				bottom: 0;
				left: 0;
				top: 0;
				opacity: 0;
				z-index: 10;
				.cell--bubble{
					width: 100%;
				}
			}
			text{
				display: block;
				line-height: 40rpx;
			}
			.t1{
				font-size: 32rpx;
			}
			.t2{
				font-size: 24rpx;
				color: #999;
			}
			image{
				width: 70rpx;
				height: 70rpx;
				position: absolute;
				left: 15rpx;
				top:25rpx;
			}
		}
	}
.maipou{
	position: fixed;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.2);
	z-index: 999;
	.maicont{
		position: absolute;
		top:30%;
		left: 10%;
		right: 10%;
		background: #FFF;
		border-radius: 10rpx;
		overflow: hidden;
	}
	.maitop{
		line-height: 100rpx;
		font-size: 30rpx;
		text-align: center;
		position: relative;
		color: #FFE8D1;
		background: #3F434E ;
		text{
			display: block;
			    position: absolute;
			    right: 0;
			    width: 100rpx;
			    font-size: 40rpx;
			    top: 0;
			    text-align: center;
		}
	}
	.contnam{
		margin: 40rpx 20rpx;
	}
	.itemmai{
		height: 120rpx;
		    padding: 20rpx;
		    line-height: 80rpx;
		    margin: 20rpx;
			border-radius: 10rpx;
			overflow: hidden;
		image{
			    width: 80rpx;
			    height: 80rpx;
			    float: left;
			    margin-right: 20rpx;
		}
	}
	.itemmai.active{
		border:1px #C3AB7C solid;
	}
	.maibtn{
		background: #F1DFB9;
		color: #221A15;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		width: 70%;
		margin: 30rpx auto;
		border-radius: 40rpx;
	}
}	
</style>
